[#ftl][#--"agile._MetadataEditor"--]
[@define "agile.NumberComboBox","agile._MetadataAware"]	
	options:"",regExp:"",valueWidget:"",decimal2Percentage:false,onOptionMouseOver:"",tabSeq:0
	,postMixInProperties:function(){
		var widget = "ComboBox";		
		//widget="checkbox|radio|select|combo"
		var numberReg = {"0":"-?(0|[1-9][0-9]*)","-0":"(0|-[1-9][0-9]*)","+0":"(0|[1-9][0-9]*)", "-1":"-[1-9][0-9]*","+1":"[1-9][0-9]*","0%":"(0.[0-9]+|[0-9]+\\.?[0-9]*%)","0.0":"-?(0|[1-9][0-9]*\\.?[0-9]*)"};
		var html = "";
		if(this.options == "" || numberReg[this.options]){
			widget = "ValidationTextBox";		
			if(numberReg[this.options]){
				if(this.unit == ""){
					this._valueRegExp = [new RegExp("^(\\s*|"+numberReg[this.options]+")$","i")];
				}else{
					this._valueRegExp = [new RegExp("^(\\s*|"+numberReg[this.options]+"("+this.unit+")?)$","i")];
				}
				if(this.placeHolder == ""){
					this.placeHolder = "123" + this.unit;
				}
			}
			else{
				this._valueRegExp = [new RegExp(this.regExp,"i")];
			}
	//		//console.log("****this.regExp=",this.regExp);,required:false
			var templateHtml = '<div style="display:inline"><div data-dojo-attach-point="editor" data-dojo-type="dijit/form/{widget}" data-dojo-props=\'trim:"true",style:"{width}",placeHolder:"{placeHolder}",required:{required}\'></div></div>';
			this.templateString = lang.replace(templateHtml,{options:html,required:this.required,placeHolder:this.placeHolder,widget:widget,width:(this.width == ""?"":"width:"+this.width)});
		}else{
			var options = this.options.split(",");
			if(this.valueWidget == "checkbox" || this.valueWidget == "radio"){
				for(var i = 0; i < options.length; i++){					
					html += "<td><input type='" + this.valueWidget +"' name='"+ this.name +"'value='" + options[i] + "'></input></td><td nowrap='true'>" + options[i]+"</td>";						
				}
				
				this.templateString = "<table style='display:inline'><tr>"+html+"</tr></table>"
			}else{
				//select or combo								
				var valueRegExp = "\\s*";
				for(var i = 0; i < options.length; i++){
					if(options[i] == "*"){
						valueRegExp += "|([\\w|\\d|-]+)";
						continue;
					}
					html += "<option>"+options[i]+"</option>";				
					if(numberReg[options[i]]){					
						if(this.unit == ""){
							valueRegExp +=  "|"+ numberReg[options[i]];
						}else{						
							valueRegExp +=  "|"+ numberReg[options[i]]+ "("+this.unit+"){0,1}";
						}
					}else{
						valueRegExp += "|" + options[i];	
					}
				}	
	//			//console.log("****valueRegExp=",valueRegExp);
				this._valueRegExp = [new RegExp("^("+valueRegExp+")$","i")];	
				
				widget = "ComboBox";
				
				var templateHtml = '<div style="display:inline"><div data-dojo-attach-point="editor" data-dojo-type="dijit/form/{widget}" data-dojo-props=\'style:"{width}",placeHolder:"{placeHolder}",required:{required}\'>{options}</div></div>';
				this.templateString = lang.replace(templateHtml,{options:html,required:this.required,placeHolder:this.placeHolder,widget:widget,width:(this.width == ""?"":"width:"+this.width)});
			}
		} 		
	//	//console.log(this.declaredClass,"this.templateString=",this.templateString);	
	}
	
//	,onStartup:function(){
//		
//		var self = this;
//		if(this.editor && this._valueRegExp){
//			this.editor.validator = function(value,constraints){
//				for(var i = 0; i< self._valueRegExp.length; i++){
//					if(!self._valueRegExp[i].test(value)){
//						return false;
//					}
//				}
//				return true;		
//			};
////			agile.onEnterKeyPress(this.editor,lang.hitch(this,"onEnterKeyPress"));
//			agile.onKeyPress(this.editor,[{keyCode:keys.ENTER,callback:lang.hitch(self,"onEnterKeyPress")}
//			,{keyCode:keys.ESC,callback:lang.hitch(self,"onEscKeyPress")}]);
//					
//			var listener= lang.hitch(this,function(name,oldValue,newValue){
//				//console.info("watch###value=",newValue,"isValid=",this.isValid(),"_fireOnChange=",this._fireOnChange,",_notWatchValue=",this._notWatchValue,",fireOnChange=",this.fireOnChange,",name=",this.name,",htmlName=",this.htmlName);
//				if(this.escKeyPressed){//cancel the change when ESC key is pressed
//					this.escKeyPressed = false;
//					this._notWatchValue = true;	
//					this.editor.set("value",oldValue);
//					this._notWatchValue = false;
//				}
//				else{
//					if(this.isValid() && !this._notWatchValue){
//						if(this._integerRegExp.test(newValue)){
//							if(this.unit){
//								newValue += this.unit;
//							}else if(this.decimal2Percentage){
//								newValue = parseFloat(newValue) * 100 +"%";
//							}
//							//set the formatted value but do not process the formatted value in this watch callback again
//							this._notWatchValue = true;	
//							this.editor.set("value",newValue);
//							this._notWatchValue = false;
//						}
//	
//						if(this._fireOnChange && this.fireOnChange){
//							if((this.name || this.htmlName) ){						
//								this.onChange(newValue,this.name,this.htmlName);
//							}							
//							this.inherited("set",["value",newValue]);
//						}
//						
//					}
//				}
//				this._fireOnChange = true;	
//			});
//			
//			if(this.editor.declaredClass.indexOf("CheckBox") != -1){
//				this.editor.watch("checked",listener);
//			}else{			
//				this.editor.watch("value",listener);
//			}
//			
//		}else{
//			//for checkbox or radio box
//
//			query("input",this.domNode).forEach(function(node){
////				console.info("#####checkbox",this.name,"_fireOnChange",this._fireOnChange);
//				connect.connect(node,"onchange",lang.hitch(this,function(value){
////					console.info("@@@@@@@@@@@@@@@@change",this.name,value);
//					if(this._fireOnChange){
//						this.onChange(this.get("value"),this.name,this.htmlName);
//					}
//					this._fireOnChange = true;
//				}))
//			},this);
//			
//		}
//	}
	,init:function(){
		
		
		//initialize the html checkbox editor
		//TODO:convert to form Checkbox widget
		if(!this.editor){			
			//for checkbox or radio box			
			query("input",this.domNode).forEach(function(node){				
				connect.connect(node,"onchange",lang.hitch(this,function(event){
					//console.info("#####checkbox=",this.name,",_notWatchValue=",this._notWatchValue,",fireOnChange=",this.fireOnChange);
					if((this.name || this.htmlName) && this.fireOnChange && !this._notWatchValue){
						this.onChange(this.get("value"),this.name,this.htmlName);						
					}
					this._notWatchValue = false;
					//notify the value watch callback
					this.inherited("set",["value",this.get("value")]);
				}))
			},this);
			
			return;			
		}
		
		//initialize the form widget editor
		this.editor.set("value","");
		var self = this;		
		if(self._valueRegExp){
			this.editor.validator = function(value,constraints){
				for(var i = 0; i< self._valueRegExp.length; i++){
					if(!self._valueRegExp[i].test(value)){
						return false;
					}
				}
				return true;		
			};
		}
		
		if(this.tabSeq){
			this.editor.set("tabIndex",this.tabSeq);
		}
		agile.onEnterKeyPress(this.editor,lang.hitch(this,"onEnterKeyPress"));
//		agile.onKeyPress(this.editor,[{keyCode:keys.ENTER,callback:lang.hitch(self,"onEnterKeyPress")}
//		,{keyCode:keys.ESC,callback:lang.hitch(self,"onEscKeyPress")}]);
				
//		aspect.after(this.editor,"focus",lang.hitch(this,function(){
//			this.hasFocus = true;	
//		}));		
		
		var listener= lang.hitch(this,function(name,oldValue,newValue){			
//			console.log(this.declaredClass,",name=",this.name,",htmlName=",this.htmlName,",value=",newValue,",_notWatchValue=",this._notWatchValue,",fireOnChange=",this.fireOnChange);			
			if(this.escKeyPressed){//cancel the change when ESC key is pressed
				this.escKeyPressed = false;
				this._notWatchValue = true;	
				this.editor.set("value",oldValue);				
				this._notWatchValue = false;
				//notify watch callback of this NumberCombooBox widget
				this.inherited("set",["value",oldValue]);
			}
			else{
				if(this.isValid()){				
					if(!this._notWatchValue){
						if(this._integerRegExp.test(newValue)){
							var value = null;
							if(this.unit){
								value = newValue + this.unit;
							}else if(this.decimal2Percentage){
								value = parseFloat(newValue) * 100 +"%";
							}
							//set the formatted value but do not process the formatted value in this watch callback again
							if(value){
								this._notWatchValue = true;	
								this.editor.set("value",value);	
								newValue = value;
							}
						}						
						if((this.name || this.htmlName) && this.fireOnChange){						
							this.onChange(newValue,this.name,this.htmlName);
						}
					}					
					//notify watch callback of this NumberCombooBox widget
					this.inherited("set",["value",newValue]);
				}
				this._notWatchValue = false;
			}
		});
		
		if(this.editor.declaredClass.indexOf("CheckBox") != -1){
			this.editor.watch("checked",listener);
		}else{			
			this.editor.watch("value",listener);
		}		
	}
	
	,get:function(name,blank){
		//summary: get value for the named attribute,if blank=true, return null if there is no value, otherwise return the default value
		if(name == "value"){
			var value = "";
			if(this.editor){
				value = this.editor.get("value");
				if(value == undefined || value == ""){
					value = null;
				}
			}
			else{
				query("input",this.domNode).forEach(function(node){
					if(node.checked){
						value += node.value +",";
					}
				});
				value = value.substring(0,value.length-1);
			}
			
			if(value == null && this.required && !blank){
				value = this.defValue;
			}
			
			return value==null?null:this.parse(value);
		}
		return this.inherited(arguments);
	}
	,set:function(name,value){
		if(name == "value"){
//			console.log("set=",this.name,name,value);
			if(this.editor){				
//				if(value == this.defValue){
//					this.editor.set(name,"");
//				}else{
//					this.editor.set(name,this.format(value));
//					this._fireOnChange = false;	
					this.editor.set("value",this.format(value));
//					this._fireOnChange = true;
//				}
			}else{				
				query("input",this.domNode).forEach(function(node){
//					this._fireOnChange = false;	
					if (value.indexOf(node.value) != -1){
						node.checked = true;
					}else{
						node.checked = false;
					}
//					this._fireOnChange = true;
				});
			}
//			this.value = value;
			this.inherited(arguments);
		}else if(name == "disabled" || name == "readOnly"){
			if(this.editor){
				this.editor.set(name,value);				
			}else{				
				query("input",this.domNode).forEach(function(node){					
					node[name] = value;					
				});
			}
		}
		else{
			this.inherited(arguments);
		}
	}
	,reset1:function(name,value){
		if(name == "value"){
			//console.log(this.declaredClass,"reset=",this.name,name,value);
			if(this.editor){
				this._notWatchValue = true;	
				//this.editor.set("value",value == this.defValue?"":this.format(value));	
				this.editor.set("value",this.format(value));
				this._notWatchValue = false;	
			}else{				
				query("input",this.domNode).forEach(function(node){
					this._notWatchValue = true;	
					node.checked = value.indexOf(node.value) != -1;
					this._notWatchValue = false;	
				},this);
			}
			this.value = value;
		}else{
			this.inherited(arguments);
		}
	}
	/*parse the display value to the value expected by the editor widget*/
	 ,parse:function(text){
		 return text;
	 }
	 /*format the value before display in the editor widget*/
	 ,format:function(value){
		 return value;
	}
	,isValid:function(){
		if(this.editor){
			return this.editor.isValid();
		}
		return true;
	}
	,focus:function(){
		if(this.editor && this.editor.isFocusable()){
			this.editor.focus();
			this.hasFocus = true;
		}
	}
	,blur:function(){
		if(this.editor && this.hasFocus){
			this.hasFocus = false;
			this.editor.focusNode.blur();
		}
	}
	,onEnterKeyPress:function(){
		//summary:post process after ENTER key is pressed on the form widget
	}
	,onEscKeyPress:function(){
		this.escKeyPressed = true;
		//blur to fire the change event
		this.blur();
	}
[/@]  
